<!--tvm票款差异协查-->
<template>
  <div class="huLianWangShouPiaojiDataInput EditorOrAdd el-card is-always-shadow el-card__body">
    <el-dialog
      title="添加/编辑操作"
      :visible.sync="dialogVisible"
      @close="closed"
      width="950px">
      <avue-form v-if="isReload" class="huLianWangShouPiaojiDataInputForm" :option="option" v-model="formData" @submit="handleSubmit">
        <template slot-scope="scope" slot="lineCode">
          <el-select v-model="formData.lineCode" placeholder="请选择" style="width: 150px" clearable @change="changeLine(formData.lineCode,true)" :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in lineCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="stationCode">
          <el-select v-model="formData.stationCode" placeholder="请选择" style="width: 150px" clearable @change="changeStation(formData.stationCode,true)" :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in stationCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>

        <!-- slot卡槽的名字为prop+Search，对应下面option的column里面的prop -->
        <template slot-scope="scope" slot="equipmentCode">
          <el-select v-model="formData.equipmentCode" placeholder="请选择" style="width: 150px" clearable  :disabled="showType==3" filterable>
            <el-option
              v-for="(item,index) in equipmentNumbers"
              :key="index"
              :label="item.equipmentCode"
              :value="item.equipmentCode">
            </el-option>
          </el-select>
        </template>

        <!-- <template slot-scope="{row}" slot="equipmentCode">
          <el-select v-model="row.equipmentId" placeholder="请选择" style="width: 150px" :disabled="showType==3">
            <el-option
              v-for="(item,index) in operationCodes"
              :key="index"
              :label="item.operationCode"
              :value="item.id">
            </el-option>
          </el-select>
        </template> -->
        <template slot-scope="{row}" slot="unitPrice" >
          <el-input-number v-model="row.unitPrice" controls-position="right" :min="0" :max="10000000" :disabled="showType==3"></el-input-number>
        </template>
        <template slot-scope="{row}" slot="saleNumber" >
          <el-input-number v-model="row.saleNumber" controls-position="right" :min="0" :max="10000000" :disabled="showType==3"></el-input-number>
        </template>
        <template slot-scope="{row}" slot="totalSaleAmount" >
          <span>{{row.totalSaleAmount= jisuanPrice(row)}}</span>
        </template>


        <template slot-scope="{row}" slot="staticDate">
          <span>{{row.staticDate}}</span>
        </template>
        <!-- <template slot-scope="{row}" slot="equipmentCode">
          <span>{{row.equipmentCode}}</span>
        </template> -->
        <template slot-scope="{row}" slot="unitPrice">
          <span>{{fenExYuangettoFixed(row,'unitPrice')}}</span>
        </template>
        <template slot-scope="{row}" slot="saleNumber">
          <span>{{row.saleNumber}}</span>
        </template>
        <template slot-scope="{row}" slot="totalSaleAmount">
          <span>{{fenExYuangettoFixed(row,'totalSaleAmount')}}</span>
        </template>


        <template slot-scope="scope" slot="menuForm" >
          <el-button type="primary" @click="closed">返回</el-button>
        </template>
      </avue-form>
    </el-dialog>
  </div>
</template>


<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import ExportJsonExcel from "js-export-excel";
  import {
    fenExYuangettoFixed,
    getgetStationCodes,
    getLineCodes,
    getSwPmDeviceOperationCodeList,getSwPmInternetTicketEquipmentCodeList,
    qianxiangType
  } from "../../../../../../api/subwayRat/commonCheck";
  import {
    getSwAuInputInternetTicketEquipmentDetails, getSwStInputInternetTicketEquipmentDetails,
    updateSwAuInputInternetTicketEquipment
  } from "../../../../../../api/subwayRat/TVMRevenueVarianceAudit.TvmChaYiDXC/huLianWangShoupiaoji/huLianWangShouPiaojiDataInput";

  export default {
    components:{
    },
    data() {
      return {
        isReload:true,
        //1编辑，2添加，3预览
        showType:1,
        dialogVisible:true,
        lineCode:'',

        lineCodes:[],
        stationCodes:[],
        operationCodes:[],
        formData:{
          dynamic: []
        },
        option:{
        },
        equipmentNumbers:[],
    }
    },
    created() {
    },
    methods: {
      fenExYuangettoFixed,
      handleSubmit(form,done){
        let param={};
        param.id=this.formData.id;
        param.lineCode=this.formData.lineCode;
        param.stationCode=this.formData.stationCode;
        //param.assistAmount=Number(this.formData.assistAmount)*100;
        param.confirmAmount=Number(this.formData.confirmAmount)*100;
        param.approvalStatus=0;
        param.confirmNumber=this.formData.confirmNumber;
        param.diffReason=this.formData.diffReason;
        param.revenueDate=this.formData.revenueDate;
        param.equipmentCode=this.formData.equipmentCode;
        param.totalNumberSales=this.formData.totalNumberSales;
        param.subtotalTotal=Number(this.formData.subtotalTotal)*100;
        param.compareTotalNumberSales=this.formData.compareTotalNumberSales;
        param.compareSubtotalTotal=Number(this.formData.compareSubtotalTotal)*100;
        updateSwAuInputInternetTicketEquipment(param).then(res=>{
          if(res.data.code==0){
            this.$message.success("操作成功！");
            this.closed();
            this.$parent.getList();
          }else{
            this.$message.error("操作失败！");
          }
        }).catch((e)=>{
          this.$message.error("操作失败！");
        });
        done();

        console.log(this.formData)
      },
      jisuanPrice(row){ //计算结果
        let res=(row.unitPrice?row.unitPrice:0)*(row.saleNumber?row.saleNumber:0);
        let saleNumberTotal=0;
        let priceTotal=0;
        for(let i=0;i<this.formData.dynamic2.length;i++){
          let saleNumber=(this.formData.dynamic2[i].saleNumber)?this.formData.dynamic2[i].saleNumber:0;
          let unitPrice=(this.formData.dynamic2[i].unitPrice)?this.formData.dynamic2[i].unitPrice:0;
          let totalSaleAmount=saleNumber*unitPrice;
          saleNumberTotal+=saleNumber;
          priceTotal+=totalSaleAmount;
        }
        this.formData.totalNumberSales=saleNumberTotal;
        this.formData.subtotalTotal=priceTotal;
        return fenExYuangettoFixed({res:res},'res');
      },
      recallShow(id,row,showType){
        this.showType=showType;
        this.getOption();
        this.formData={}
       Object.assign(this.formData,row);
        this.changeLine(row.lineCode,false);
        this.changeStation(row.stationCode,false);
        this.formatAmount(this.formData,true);
        let param={};
        param.lineCode=this.formData.lineCode;
        param.stationCode=this.formData.stationCode;
        param.startTime=this.formData.startTime;
        param.endTime=this.formData.endTime;

        getSwStInputInternetTicketEquipmentDetails(param).then(res=>{
          this.formData.dynamic=res.data.data;
        }).catch((e)=>{
          this.$message.error("操作失败！");
        });
        getSwAuInputInternetTicketEquipmentDetails(param).then(res=>{
          this.formData.dynamic2=res.data.data;
        }).catch((e)=>{
          this.$message.error("操作失败！");
        });


      },
      formatAmount(row,isYuan){ //是否是元
        console.log(row);
        if(isYuan){
          row.subtotalTotal=fenExYuangettoFixed(row,'subtotalTotal');
          //row.assistAmount=fenExYuangettoFixed(row,'assistAmount');
          row.confirmAmount=fenExYuangettoFixed(row,'confirmAmount');
          row.compareSubtotalTotal=fenExYuangettoFixed(row,'compareSubtotalTotal');
          // row.subtotalTotal=fenExYuangettoFixed(row,'subtotalTotal');
        }else{
          row.subtotalTotal=Number(row.subtotalTotal)*100;
          //row.assistAmount=Number(row.assistAmount)*100;
          row.confirmAmount=Number(row.confirmAmount)*100;
          row.compareSubtotalTotal=Number(row.compareSubtotalTotal)*100;
          // row.subtotalTotal=Number(row.subtotalTotal)*100;
        }

      },
      closed(){
        this.dialogVisible=false;
        this.$parent.isShowDia=false;
      },
      getOption(){
        this.option={
          submitBtn:this.showType!=3,
          emptyBtn:false,
          group:[
            {
              icon:'',
              label: '',
              // collapse:false,
              prop: 'group1',
              column: [{
                label: '线路',
                prop: 'lineCode',
                type: 'select',
                labelWidth:130,
                formslot:true,
                rules: [{
                  required: true,
                  message: '请选择线路',
                  trigger: 'blur'
                }]
              },{
                label: '站点',
                prop: 'stationCode',
                type: 'select',
                // width:250,
                labelWidth:130,
                formslot:true,
                rules: [{
                  required: true,
                  message: '请选择站点',
                  trigger: 'blur'
                }]
              },{
                label: '收益日期',
                prop: 'revenueDate',
                valueFormat: 'yyyy-MM-dd',
                labelWidth:130,
                type:'date',
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请选择收益日期',
                  trigger: 'blur'
                }]
              },{
                label: '设备编号',
                prop: 'equipmentCode',
                type: 'select',
                labelWidth:130,
                formslot:true,
                rules: [{
                  required: true,
                  message: '请选择设备编号',
                  trigger: 'blur'
                }]
              },{
                label: '发售数量',
                prop: 'totalNumberSales',
                // width:'250',
                labelWidth:130,
                type:'number',
                //disabled: true
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请输入发售数量',
                  trigger: 'blur'
                }]
              },{
                label: '小计金额',
                prop: 'subtotalTotal',
                // width:'250',
                labelWidth:130,
                precision:2,
                type:'number',
                //disabled: true
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请输入小计金额',
                  trigger: 'blur'
                }]
              },{
                label: '对比发售数量',width: 120,
                prop: 'compareTotalNumberSales',
                // width:'250',
                labelWidth:130,
                type:'number',
                //disabled: true
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请输入对比发售数量',
                  trigger: 'blur'
                }]
              },{
                label: '对比小计金额',width: 120,
                prop: 'compareSubtotalTotal',
                // width:'250',
                labelWidth:130,
                precision:2,
                type:'number',
                //disabled: true
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请输入对比小计金额',
                  trigger: 'blur'
                }]
              },{
                label: '开始时间',
                prop: 'startTime',
                valueFormat: 'yyyy-MM-dd',
                // width:'250',
                labelWidth:130,
                type:'date',
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请选择开始时间',
                  trigger: 'blur'
                }]
              },{
                label: '结束时间',
                prop: 'endTime',
                valueFormat: 'yyyy-MM-dd',
                // width:'250',
                labelWidth:130,
                type:'date',
                disabled: this.showType==3,
                rules: [{
                  required: true,
                  message: '请选择结束时间',
                  trigger: 'blur'
                }]
              },
                // {
                //   label: '协查金额',
                //   prop: 'assistAmount',
                //   // width:'250',
                //   labelWidth:130,
                //   type:'number',
                //   precision:2,
                //   disabled: this.showType==3
                // },
                {
                  label: '确认金额',
                  prop: 'confirmAmount',
                  // width:'250',
                  precision:2,
                  labelWidth:130,
                  type:'number',
                  disabled: this.showType==3,
                  rules: [{
                    required: true,
                    message: '请输入确认金额',
                    trigger: 'blur'
                  }]
                },
                {
                  label: '确认数量',
                  prop: 'confirmNumber',
                  // width:'250',
                  labelWidth:130,
                  type:'number',
                  disabled: this.showType==3,
                  rules: [{
                    required: true,
                    message: '请输入确认数量',
                    trigger: 'blur'
                  }]
                },{
                  label: '差异原因',
                  prop: 'diffReason',
                  // width:'250',
                  labelWidth:130,
                  type:'textarea',
                  disabled: this.showType==3
                },{
                  label: '备注',
                  prop: 'remark',
                  // width:'250',
                  labelWidth:130,
                  type:'textarea',
                  disabled: this.showType==2 || this.showType==3,
                }]
            },
            // {
            //   icon:'',
            //   sortable:true,
            //   label: '互联网售票机车站数据',
            //   // collapse:false,
            //   width:600,
            //   span:24,
            //   prop: 'group2',
            //   column: [{
            //     label: '',
            //     prop: 'dynamic',
            //     type: 'dynamic',
            //     children: {
            //       addBtn:false,
            //       delBtn:false,
            //       sortable:true,
            //       align: 'center',
            //       headerAlign: 'center',
            //       column: [{
            //         width: 200,
            //         label: '日期',
            //         prop: "staticDate",
            //         formslot: true,
            //         hide:true
            //       }, {
            //         width: 200,
            //         label: '设备编号',
            //         prop: "equipmentCode",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '票价',
            //         prop: "unitPrice",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '发售张数',
            //         prop: "saleNumber",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '小计金额',
            //         prop: "totalSaleAmount",
            //         formslot: true,

            //       }]
            //     }
            //   }
            //   ]
            // },
            // {
            //   icon:'',
            //   sortable:true,
            //   label: '互联网售票机线路数据',
            //   // collapse:false,
            //   width:600,
            //   span:24,
            //   prop: 'group2',
            //   column: [{
            //     label: '',
            //     prop: 'dynamic2',
            //     type: 'dynamic',
            //     children: {
            //       addBtn:false,
            //       delBtn:false,
            //       sortable:true,
            //       align: 'center',
            //       headerAlign: 'center',
            //       column: [{
            //         width: 200,
            //         label: '日期',
            //         prop: "staticDate",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '设备编号',
            //         prop: "equipmentCode",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '票价',
            //         prop: "unitPrice",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '发售张数',
            //         prop: "saleNumber",
            //         formslot: true,
            //       }, {
            //         width: 200,
            //         label: '小计金额',
            //         prop: "totalSaleAmount",
            //         formslot: true,

            //       }]
            //     }
            //   }
            //   ]
            // },
          ]
        } ;
        this.isReload=false;
        this.$nextTick(()=>{
          this.isReload=true;
        })
      },
      changeLine(v,isClear){ //改变线路时
        getgetStationCodes(v).then(res=>{
          this.stationCodes=res;
          if(isClear){
             this.equipmentNumbers=[];
             this.formData.equipmentCode='';
           }
        });
      },
      changeStation(v,isClear){
        this.getSheBei(v,isClear);
      },
      getSheBei(v,isClear){
            if(isClear){
              this.formData.equipmentCode='';
            }
          getSwPmInternetTicketEquipmentCodeList({lineCode:this.formData.lineCode,stationCode:v}).then(r=>{
            this.equipmentNumbers=r.data.data;
        });
      },
    },
    mounted() {
      getLineCodes().then(res=>{ //获取线路
        this.lineCodes=res;
      });
    }
  }
</script>
<style lang="scss">
  .huLianWangShouPiaojiDataInput.EditorOrAdd{
    .avue-group[index='2']{
      .avue-form__group{
        .avue-form__row{
          width: 100%;
        }
      }
    }
    .avue-group[index='3']{
      .avue-form__group{
        .avue-form__row{
          width: 100%;
        }
      }
    }
    @media only screen and (min-width: 992px){
      width: 100%;
    }
  }

</style>
